<template>
  <div> 
     <!-- 子组件 -->
     <List :todos="todos">
            <template slot-scope="{$row,$index}">
                      <h1 :style="{color:$row.isComplete?'red':'green'}">{{$index}}---{{$row.text}}</h1>
            </template>
     </List>
  </div>
</template>

<script type="text/ecmascript-6">
  import List from './List'
  import Child from './Child'
  export default {
    name: 'ScopeSlotTest',
    data () {
      return {
        todos: [
          {id: 1, text: 'AAA', isComplete: false},
          {id: 2, text: 'BBB', isComplete: true},
          {id: 3, text: 'CCC', isComplete: false},
          {id: 4, text: 'DDD', isComplete: false},
        ]
      }
    },

    components: {
      List,
      Child
    }
  }
</script>
